<!DOCTYPE html>
<html>
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="viewport" content="width=device-width, width=640px,user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <title>首页</title>

    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/swiper.css">
    <link rel="stylesheet" type="text/css" href="css/home.css" />

    </head>
    <body>
        <div class="warp">
            <div class="swiper-container">
                <ul class="swiper-wrapper">
                    <li class="swiper-slide"><a href="detail.html"><img src="images/banner.png"  alt="" /></a></li>
                    <li class="swiper-slide"><a href="detail.html"><img src="images/banner.png"  alt="" /></a></li>
                    <li class="swiper-slide"><a href="detail.html"><img src="images/banner.png"  alt="" /></a></li>
                    <li class="swiper-slide"><a href="detail.html"><img src="images/banner.png"  alt="" /></a></li>
                    <li class="swiper-slide"><a href="detail.html"><img src="images/banner.png"  alt="" /></a></li>
                    <li class="swiper-slide"><a href="detail.html"><img src="images/banner.png"  alt="" /></a></li>
                    <li class="swiper-slide"><a href="detail.html"><img src="images/banner.png"  alt="" /></a></li>
                    <li class="swiper-slide"><a href="detail.html"><img src="images/banner.png"  alt="" /></a></li>
                    <li class="swiper-slide"><a href="detail.html"><img src="images/banner.png"  alt="" /></a></li>
                </ul>
                <div class="swiper-pagination"></div>
            </div>
            <div class="leisure">
                <ul>
                    <li>
                    <a href="store.html">
                    <img src="images/lisure-1.png"  alt="" />
                    <span class="leisure_world">Work Out</span>
                    </a>
                    </li>
                     <li>
                     <a href="store.html">
                    <img src="images/lisure-2.png"  alt="" />
                    <span class="leisure_world">Recreation</span>
                    </a>
                    </li>
                     <li>
                     <a href="store.html">
                    <img src="images/lisure-3.png"  alt="" />
                    <span class="leisure_world">Tourism</span>
                    </a>
                    </li>
                     <li>
                     <a href="store.html">
                    <img src="images/lisure-4.png"  alt="" />
                    <span class="leisure_world">Hairdressing</span>
                    </a>
                    </li>
                     <li>
                     <a href="store.html">
                    <img src="images/lisure-5.png"  alt="" />
                    <span class="leisure_world">Study Training</span>
                    </a>
                    </li>
                     <li>
                     <a href="store.html">
                    <img src="images/lisure-6.png"  alt="" />
                    <span class="leisure_world">Beauty SPA</span>
                    </a>
                    </li>
                     <li>
                     <a href="store.html">
                    <img src="images/lisure-7.png"  alt="" />
                    <span class="leisure_world">Fitting</span>
                    </a>
                    </li>
                     <li>
                     <a href="store.html">
                    <img src="images/lisure-8.png"  alt="" />
                    <span class="leisure_world">All Categories</span>
                    </a>
                    </li>
                </ul>
                
            </div>
            <div class="space1"></div>
            <div class="produce">
                <div class="produce_warp">
                    <div style="overflow:hidden;margin-bottom: 20px;">
                        <div class="produce_title">Popular Serve</div>
                        <div class="produce_more">
                            <a href="detail.html">
                            <span>More</span>
                            <i class="img_more"></i>
                            </a>
                        </div>
                    </div>
                    <ul class="produce_top">
                        <li >
                        <a href="detail.html">
                        <img src="images/produce-1.png"  alt="" />
                        <span class="leisure_world">Dress Socks</span>
                        </a>                        
                        </li>
                        <li >
                        <a href="detail.html">
                        <img src="images/produce-2.png"  alt="" />
                        <span class="leisure_world">Digital Product</span>
                        </a>                        
                        </li>
                        <li >
                        <a href="detail.html">
                        <img src="images/produce-3.png"  alt="" />
                        <span class="leisure_world">Boutiques</span> 
                        </a>                       
                        </li>
                        <li >
                        <a href="detail.html">
                        <img src="images/produce-4.png"  alt="" />
                        <span class="leisure_world">Cosmetic</span> 
                        </a>                       
                        </li>
                    </ul>
                    <div class="line"></div>
                    <ul class="produce_top">
                        <li >
                        <a href="detail.html">
                        <img src="images/produce-5.png"  alt="" />
                        <span class="leisure_world">Beauty Salons</span>
                        </a>                        
                        </li>
                        <li >
                        <a href="detail.html">
                        <img src="images/produce-6.png"  alt="" />
                        <span class="leisure_world">Nail Beauty Pupil</span> 
                        </a>                       
                        </li>
                        <li >
                        <a href="detail.html">
                        <img src="images/produce-7.png"  alt="" />
                        <span class="leisure_world">SPA</span>  
                        </a>                      
                        </li>
                        <li >
                        <a href="detail.html">
                        <img src="images/produce-8.png"  alt="" />
                        <span class="leisure_world">Tattoo</span> 
                        </a>                       
                        </li>
                    </ul>
                </div>
                
            </div>
            <div class="space_world">
                <div class="space_line"></div>
                <div class="space_content">
                    <i class="praise"></i>
                    <span class="guess">Guess You Like</span>
                </div>
                <div class="space_line"></div>
            </div>  
            <div class="store_warp">
                <a href="detail.html">
                <div class="store_content">
                    <div class="store_left">
                       
                        <img src="images/store-1.png"  alt="" />
                        
                    </div>
                    <div class="store_right">
                        <div class="store_rating">
                            <span class="store_title">MacDonald</span>
                            <div class="star_warp">
                            <ul class="star">
                                <li class="star_right"></li>
                                <li class="star_right"></li>
                                <li class="star_right"></li>
                                <li class="star_right"></li>
                                <li class="star_black"></li>
                            </ul>
                            <i class="star_num"><em class="num_left">9</em><em class="num_right">.2</em></i>
                            </div>
                            <span class="store_detail">Suzhou City,Jiangsu Province</span>
                        </div>
                        <div class="store_coment">
                            <i class="eye"></i>
                            <span class="comment_num">13373</span>
                        </div>

                    </div>
                </div>
                </a>
                
                <a href="detail.html">
                <div class="store_content">
                    <div class="store_left">
                        
                        <img src="images/store-2.png"  alt="" />
                        
                    </div>
                    <div class="store_right">
                        <div class="store_rating">
                            <span class="store_title">Kentucky Fried Chicken</span>
                            <div class="star_warp">
                            <ul class="star">
                                <li class="star_right"></li>
                                <li class="star_right"></li>
                                <li class="star_right"></li>
                                <li class="star_right"></li>
                                <li class="star_black"></li>
                            </ul>
                            <i class="star_num"><em class="num_left">9</em><em class="num_right">.2</em></i>
                            </div>
                            <span class="store_detail">Suzhou City,Jiangsu Province</span>
                        </div>
                        <div class="store_coment">
                            <i class="eye"></i>
                            <span class="comment_num">13373</span>
                        </div>

                    </div>
                </div>
                </a>

                <a href="detail.html">
                <div class="store_content">
                    <div class="store_left">
                        
                        <img src="images/store-3.png"  />
                        
                    </div>
                    <div class="store_right">
                        <div class="store_rating">
                            <span class="store_title">Dicos Snack</span>
                            <div class="star_warp">
                            <ul class="star">
                                <li class="star_right"></li>
                                <li class="star_right"></li>
                                <li class="star_right"></li>
                                <li class="star_right"></li>
                                <li class="star_black"></li>
                            </ul>
                            <i class="star_num"><em class="num_left">9</em><em class="num_right">.2</em></i>
                            </div>
                            <span class="store_detail">Suzhou City,Jiangsu Province</span>
                        </div>
                        <div class="store_coment">
                            <i class="eye"></i>
                            <span class="comment_num">13373</span>
                        </div>

                    </div>
                </div>
            </div>
            </a>

    </div>
    <script src="js/jquery.min.js"></script>
    <script src="js/swiper.min.js"></script>
     <script>
    var swiper = new Swiper('.swiper-container', {
        pagination: '.swiper-pagination',        
        paginationClickable: true,
        spaceBetween: 30,
        centeredSlides: true,
        autoplay: 2500,
        autoplayDisableOnInteraction: false
    });
    </script>
    </body>
</html>